<template>
	<div class="zuzhiguanli animate__animated animate__fadeIn">
    <div style="width: calc(100vw - 220px); height: 100vh; overflow: auto;">
      <div class="flexc" style="padding: 30px 30px 0;">
          <el-button type="primary" icon="el-icon-plus" @click="logshow">添加轴承库</el-button>

      </div>

      <div class="flexc" style="padding:30px;">

        <div><el-input v-model="search.param.produceName" style="width: 200px; margin-right: 20px;" placeholder="请输入制造厂商"></el-input></div>
        <div>
          <el-input v-model="search.param.model" style="width: 200px; margin-right: 20px;" placeholder="请输入型号"></el-input>
        </div>
        <el-button type="primary" @click="searchgo()">检索</el-button>
      </div>
      <div style="padding:0 30px;">
          <el-table :data="list" style="width: 100%;">
            <el-table-column align="center" prop="produceName" label="制造厂商"></el-table-column>
            <el-table-column align="center" prop="model" label="型号"></el-table-column>
            <el-table-column align="center" prop="rollerNum" label="滚动体数目"></el-table-column>
            <el-table-column align="center" prop="rollerJing" label="滚柱直径"></el-table-column>
            <el-table-column align="center" prop="jyJing" label="节圆直径"></el-table-column>
            <el-table-column align="center" prop="wyJing" label="外圆直径"></el-table-column>
            <el-table-column align="center" prop="width" label="宽度"></el-table-column>
            <el-table-column align="center" prop="jcj" label="接触角"></el-table-column>
            <el-table-column align="center" prop="rpm" label="转速"></el-table-column>
            <el-table-column align="center" prop="bpfo" label="BPFO"></el-table-column>
            <el-table-column align="center" prop="bpfi" label="BPFI"></el-table-column>
            <el-table-column align="center" prop="ftfo" label="FTFO"></el-table-column>
            <el-table-column align="center" prop="ftfi" label="FTFI"></el-table-column>
            <el-table-column align="center" prop="bsf" label="BSF"></el-table-column>


            <el-table-column align="center" label="操作">
              <template slot-scope="scope">
                <div class="flexcc">
                  <div style="color: #0093F6; cursor: pointer; margin: 0 10px;" @click="bianji(scope.row)">修改</div>
                  <div style="color: #f00; cursor: pointer; margin: 0 10px;" @click="shanchu(scope.row)">删除</div>

                </div>
              </template>
            </el-table-column>
          </el-table>

          <el-pagination style="padding: 20px; text-align: right;"
            @current-change="fanye"
            background
            :page-size="search.size"
            layout="total,prev, pager, next"
            :total="total">
          </el-pagination>
      </div>
    </div>

    <el-dialog :title="logtitle" center :visible.sync="log" width="900px"  :close-on-click-modal="false" :close-on-press-escape="false" :modal-append-to-body="true">

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>制造厂商</div>
          <div><el-input v-model="all.produceName"  style="width: 250px; margin-left: 30px;" placeholder="请输入制造厂商"></el-input></div>

          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>型号</div>
          <div><el-input v-model="all.model" style="width: 250px; margin-left: 30px;" placeholder="请输入型号"></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>滚动体数目</div>
          <div><el-input v-model="all.rollerNum" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入滚动体数目"></el-input></div>

          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>滚柱直径</div>
          <div><el-input v-model="all.rollerJing" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入滚柱直径"><template slot="append">mm</template></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>节圆直径</div>
          <div><el-input v-model="all.jyJing" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入节圆直径"><template slot="append">mm</template></el-input></div>
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>外圆直径</div>
          <div><el-input v-model="all.wyJing" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入外圆直径"><template slot="append">mm</template></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>宽度</div>
          <div><el-input v-model="all.width" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入宽度"><template slot="append">mm</template></el-input></div>
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>接触角</div>
          <div><el-input v-model="all.jcj" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入接触角"><template slot="append">°</template></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>转速</div>
          <div><el-input v-model="all.rpm" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入转速"></el-input></div>
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>BPFO</div><!-- （0.4*转速*滚动体数） -->
          <div><el-input v-model="all.bpfo" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入BPFO"></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>BPFI</div><!-- （0.6*转速*滚动体数） -->
          <div><el-input v-model="all.bpfi" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入BPFI"></el-input></div>
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>FTFO</div><!-- （0.4*转速） -->
          <div><el-input v-model="all.ftfo" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入FTFO"></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>FTFI</div><!-- （0.4*转速） -->
          <div><el-input v-model="all.ftfi" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入FTFI"></el-input></div>
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>BSF</div>
          <div><el-input v-model="all.bsf" type="number" onKeypress="return (/[\d]/.test(String.fromCharCode(event.keyCode)))" style="width: 250px; margin-left: 30px;" placeholder="请输入BSF"></el-input></div>
        </div>

        <div class="flexc" style="margin-bottom: 20px;">
          <div style="width: 100px; text-align: right;"><span style="color: #f00; margin-right: 5px;">*</span>图片</div>
          <div style="margin-left: 30px;">
            <chuantu2 :widths="'200px'" :heights="'200px'" :widths2="'200px'" :heights2="'200px'" :imgs="all.img" @getimg="getimg" v-if="relo2"></chuantu2>
          </div>

        </div>

    	  <span slot="footer" class="dialog-footer">
          <el-button type="danger" round @click="log = false">取消</el-button>
          <el-button type="danger" round @click="add">确定</el-button>
    	  </span>
    </el-dialog>

	</div>
</template>

<script>

  import chuantu2 from '@/components/chuantu2.vue'
  import { addbearingLib,removebearingLib,updatebearingLib,getbearingLib } from '@/api/zhoucheng'
  import left2 from '@/view/left2.vue'
	export default {
		name: 'zuzhiguanli',
    components:{
      left2,chuantu2
    },
		data() {
			return {
        all:{
          "produceName":"",
          "model":"",
          "rollerNum":"",
          "rollerJing":"",
          "jyJing":"",
          "wyJing":"",
          "width":"",
          "jcj":"",
          "rpm":"",
          "bpfo":"",
          "bpfi":"",
          "ftfo":"",
          "ftfi":"",
          "bsf":"",
          "img":"",
          "libId": "",
        },
        list:[],
        search:{
            "page":1,
            "size":10,
            "param":{
              "produceName":"",
              "model":"",
            }
        },
        total:0,

        log:false,
        logtitle:"",

        xialaall:{
          fenleilist:"",
          zhuangtailist:"",
          xitonglist:""
        },
        relo2:true

			}
		},
		created() {
      this.getlist()
      // this.getxialalist()
		},
		mounted() {

		},
		methods: {
      getimg:function(item){
        // console.log(item.img)
        // console.log(item.imgId)
        this.all.img = item.imgurl
      },
      qinghuancun:function(){
        refreshtype().then((response)=>{
          this.$message.success('清除缓存成功');
          this.getlist()
        })
      },
      guanli:function(item){
        this.$router.push({
          path:'/zidian/zidianshuju',
          query:{
            allDictType:item.allDictType,
          }
        })
      },

      shanchu:function(item){
        this.$confirm('此操作将永久删除, 是否继续?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          removebearingLib(item.libId).then((response)=>{
            this.$message.success('删除成功');
            this.getlist()
          })
        })
      },

      bianji:function(item){
        this.logtitle = '修改轴承库'

        this.all = {
          "produceName":item.produceName,
          "model":item.model,
          "rollerNum":item.rollerNum,
          "rollerJing":item.rollerJing,
          "jyJing":item.jyJing,
          "wyJing":item.wyJing,
          "width":item.width,
          "jcj":item.jcj,
          "rpm":item.rpm,
          "bpfo":item.bpfo,
          "bpfi":item.bpfi,
          "ftfo":item.ftfo,
          "ftfi":item.ftfi,
          "bsf":item.bsf,
          "img":item.img,
          libId:item.libId
        }
        this.log = true

      },
      chushihua:function(){
        this.xialaall.xitonglist.forEach(item=>{
          if(item.mr){this.all.sysName = parseInt(item.value) }
        })
      },
      logshow:function(){
        this.logtitle = '新增轴承库'
        this.all = {
          "produceName":"",
          "model":"",
          "rollerNum":"",
          "rollerJing":"",
          "jyJing":"",
          "wyJing":"",
          "width":"",
          "jcj":"",
          "rpm":"",
          "bpfo":"",
          "bpfi":"",
          "ftfo":"",
          "ftfi":"",
          "bsf":"",
          "img":""
        }
        this.log = true
      },

      add:function(){
        if(this.all.libId){
          updatebearingLib(this.all).then((response)=>{
            this.$message.success('修改成功');
            this.log = false
            this.getlist()
          })
        }else{
          addbearingLib(this.all).then((response)=>{
            this.$message.success('新增成功');
            this.log = false
            this.getlist()
          })
        }
      },

      searchgo:function(){
        this.search.page = 1
        this.getlist()
      },

      getlist:function(){
        getbearingLib(this.search).then((response)=>{
          this.list = response.data.result
          this.total = response.data.count
        })
      },

      fanye:function(val){
        this.search.page = val
        this.getlist()
      },


      //获取下啦数据用
      getxialalist:function(){
        getxiala('valueType').then((response)=>{
          this.xialaall.fenleilist = response.data
        })
        getxiala('sysName').then((response)=>{
          this.xialaall.xitonglist = response.data
        })
        getxiala('status').then((response)=>{
          this.xialaall.zhuangtailist = response.data
        })
      }
		}
	}
</script>


<style scoped >

</style>
